<template>
<div class="swiper">
    <swiper :options="swiperOption">

        <swiper-slide v-for="item of headerImg" :key="item.id">
            <img class="t" :src="item.imgUrl" />
        </swiper-slide>

        <div class="swiper-pagination" slot="pagination"></div>

    </swiper>
</div>
</template>

<script>
//	定义输出组件name
export default {
    name: 'homeSwiper',
    //  props:{
    //    swiperList:Array
    //  },
    props: {
        headerImg: Array

    },

    data() {
        return {

            swiperOption: {
                pagination: '.swiper-pagination',
                loop: true
            }
        }
    },

}
</script>

  <!--给css样式设置语言工具stylus-->

<style scoped>
/*.swiper{

position: absolute;

top: 0px;

  	}*/
.t {
    height: 230px;
    width: 100%;
}

/*.swiper-pagination{

position: absolute;

top: -400px;

left: -200px;
  	}*/
/*.wrapper >>> .swiper-pagination-bullet{
  	 background: beige;
  	}*/
/*定义跳过scoped书写样式 简称穿透*/
/deep/ .swiper-pagination-bullet {
    background: rgb(255, 255, 255);

}
</style>
